<template>
    <!-- <div class='my_input'>
        <span>姓名：</span>
        <input type="text" v-model="message">
        <input :value="message" @input="message = $event.target.value"/>
        <p>内容是：{{message}}</p>
    </div> -->
<div class='my_input'>
        <span>姓名：</span>
        <input type="text" :value="value" @input="$emit('input',$event.target.value)">
    </div>
</template>

<script>
export default {
    props:{
      value: [String,Number]
    },
    data() {
        return {
          message: '张三'
        };
    },
    created() {},
    methods: {
      input(e){ // 输入发生了改变都会触发
        // console.log(e.target.value);
        this.message = e.target.value;
      },
      change(e){ // 当值发生改变时触发
        console.log(e.target.value);
      },
      // inputFtn(e){
      //   //  console.log(e.target.value);
      //    this.$emit('input', e.target.value);
      // }
    },
    components:{}
};
</script>

<style lang='scss'>
  .my_input{
    height: 50px;
    display: flex;
    justify-content: center;
    width: 300px;
    margin: 100px auto;
    align-items: center;
  }
</style>
